<template>
    <el-container class="wrapper">
        <el-header class="header">
            <!-- 命名视图 -->
            <router-view name="header"></router-view>
        </el-header>

        <div class="main">
            <!-- 默认视图 -->
            <router-view></router-view>
        </div>

        <el-footer class="footer">
            <!-- 命名视图 -->
            <router-view name="footer"></router-view>
        </el-footer>

    </el-container>
</template>

<script>
</script>

<style>
body {
    margin: 0;
    padding: 0;
}
</style>

<style scoped>
.header {
    height: 10vh;
    background: #ffa;
}
.main {
    height: 80vh;
}
.footer {
    height: 10vh;
    background: #ddd;
}
</style>
